@charset"utf-8";
@import'color';
@import'model-beta';
@import'common';
$themeColor:#E9E7E8;
$fontColor:#fff;
$btnHover:#f00;
$black2:#757575;
html, body {
    width: 100%;
    transform: translate3d(0, 0, 0)\9;
    background-color: $themeColor;
}
._top {
    * {
        @include comic(0.3);
    }
    position: fixed;
    background-color: $themeColor;
    top: 0;
    left: 0;
    width: 100%;
    @include shadow(0, 0, 0, #000);
    &, * {
        color: $black2;
    }
    &.focus {
        @include shadow(0, 0, 4px, #999);
        .box {
            padding: 0;
            .title {
                font-size: 17px;
                padding: 10px 0;
            }
        }
    }
    .box {
        width: 1000px;
        padding: 20px 12px;
        .title {
            display: inline-block;
            vertical-align: middle;
            font-size: 24px;
            width: 30%;
            padding: 18px 0;
            margin-right: 5%;
        }
        .nav {
            width: 40%;
            display: inline-block;
            vertical-align: middle;
            a {
                color: $black2;
                font-size: 15px;
                display: inline-block;
                vertical-align: middle;
                cursor: pointer;
                padding: 0 10px;
                margin: 0 10px;
                &:hover {
                    color: $btnHover;
                }
            }
        }
        .cart {
            display: inline-block;
            vertical-align: middle;
            width: 25%;
            text-align: right;
            .icon-cart {
                color: $fontColor;
                background-color: mix($themeColor, $black2, .3);
                display: inline-block;
                padding: 5px 10px;
                &:before {
                    padding-right: 3px;
                }
            }
        }
    }
}
.main {
    width: 100%;
    padding-top: 110px;
    .adbox {
        width: 100%;
        background-color: $white;
        .box {
            width: 1024px;
            height: 380px;
        }
    }
}
.goodsbox {
    width: 1024;
    padding: 25px 0;
    @include newLine;
    .title {
        padding: 0 12px;
        font-size: 18px;
        color: $black;
    }
    .goodsitem {
        width: 20%;
        margin: 15px 2%;
        display: inline-block;
        vertical-align: top;
        @include shadow(0, 0, 4px, #999);
        .img {
            width: 100%;
            cursor: pointer;
        }
        .intro {
            @include Line(1);
            color: #999;
        }
        .name {
            cursor: pointer;
            font-size: 16px;
        }
        .info {
            width: 100%;
            padding: 5px 0;
            background-color: $white;
        }
        .item {
            @include Line(1);
            width: 96%;
            padding: 5px 2%;
        }
        .price {
            color: $red;
        }
        .num {
            font-size: 16px;
        }
    }
}
.bottom {
    margin-top: 35px;
    width: 100%;
    border-top: 1px solid mix($themeColor, $black2, .9);
    text-align: center;
    color: $black2;
    padding: 15px 0;
    div {
        a {
            color: $black2;
        }
        padding: 8px 0;
    }
}
